import { useState, useEffect } from 'react';
import { InputProps, Form, Cascader, TreeSelect } from 'antd';
import {
  ProFormText,
  ProFormSelect,

  // ProFormDependency,
} from '@ant-design/pro-form';
import utils from '@/utils/index';
import { services } from '@/network/api';
//获取角色
const getAccessList = async (params: any) => {
  let res = await services.getAccessList({ noPagination: true, noMsg: true });
  return res?.data?.map((item: any) => {
    return {
      label: item.name,
      value: item.id,
    };
  });
};

//获取岗位
const getJobList = async (params: any) => {
  let res = await services.getJobList({ noPagination: true, noMsg: true });
  return res?.data?.map((item: any) => {
    return {
      label: item.name,
      value: item.id,
    };
  });
};

type formProps = {
  id?: number;
  name?: string;
  label?: string;
  busType?: number; //{1:用户}
  fieldType?: number; //{1:文本框，2：单选，3：多选，4：日期}
  isDefault?: number;
  isRequire?: number;
  isEnable?: number;
  multiple?: number;
  fieldOption?: string;
  describe?: string;
  createDate?: string;
  order?: number;
  max?: number;
  min?: number;
  regEx?: string;
  precision?: number; //保留几位小数
  disabled?: any;
  fieldProps?: InputProps & any;
  rule?: any;
  placeholder: string;
};

export default (props: formProps) => {
  const {
    label,
    isEnable,
    fieldType,
    isDefault,
    name,
    id,
    isRequire,
    regEx,
    min,
    max,
    precision,
    fieldOption,
    disabled,
    fieldProps = {},
    rule = [],
    placeholder,
    multiple,
    ...restProps
  } = props;
  let _name = isDefault ? name : `custom_${id}_${fieldType}`;

  //验证修改
  !!isRequire &&
    rule.push({
      required: true,
      message: `请输入${label}`,
    });
  !isEnable && (rule.length = 0);

  //组件配置修改
  !isDefault && (fieldProps.labelInValue = true); //返回选项所有值
  fieldProps.disabled = disabled; //表单禁用选项
  fieldType === 2 && (fieldProps.precision = precision); //数字表单精度

  //获取组件配置
  const [formOption, setFormOption]: any = useState([]);

  useEffect(() => {
    switch (fieldType) {
      case 100:
        const getAreaTree = async () => {
          const res = await services.getAreaTree();
          setFormOption(res?.data?.children || []);
        };
        getAreaTree();
        break;
      case 101:
        const getDepartmentTree = async () => {
          const res = await services.getDepartmentTreeList({ noMsg: true, noThrottle: true });
          let data = utils.obj.treeSelectFormData(res?.data, {
            title: 'name',
            value: 'id',
            children: 'children',
          });
          setFormOption(data || []);
        };
        getDepartmentTree();
        break;
      default:
        break;
    }
  }, [fieldType]);

  switch (fieldType) {
    case 100:
      return (
        <Form.Item name={_name} rules={rule} label={label} {...restProps}>
          <Cascader
            {...fieldProps}
            preserve
            fieldNames={{ label: 'name', value: 'id', children: 'children' }}
            options={formOption}
            placeholder={placeholder}
          />
        </Form.Item>
      );
    case 101:
      return (
        <Form.Item name={_name} rules={rule} label={label} {...restProps}>
          <TreeSelect
            {...fieldProps}
            preserve
            multiple={!!multiple}
            treeData={formOption}
            treeCheckable={false}
            placeholder={placeholder}
            allowClear
          />
        </Form.Item>
      );
    case 102:
      return (
        <ProFormSelect
          {...restProps}
          preserve
          name={_name}
          rules={rule}
          label={label}
          placeholder={placeholder}
          fieldProps={{ mode: !!multiple ? 'multiple' : '', ...fieldProps }}
          request={getAccessList}
        />
      );
    case 103:
      return (
        <ProFormSelect
          {...restProps}
          preserve
          name={_name}
          rules={rule}
          label={label}
          placeholder={placeholder}
          fieldProps={{ mode: !!multiple ? 'multiple' : '', ...fieldProps }}
          request={getJobList}
        />
      );
    default:
      return (
        <ProFormText
          preserve
          label={label}
          rules={rule}
          name={_name}
          fieldProps={fieldProps}
          {...restProps}
        />
      );
  }
};
